<style scoped>
.action_button{height: 26px;line-height: 26px;margin: 0 2px;}
</style>
<template>
  <van-cell class="row-order-bottom">
    <template #title>
      <div class="flex">
        <div>实付：</div>
        <money :value="pay_money"></money>
      </div>
    </template>
    <template #value>
      <van-button class="action_button" v-for="can_action in can_action_list" :type="buttonType(can_action)" :text="can_action.label" :size="'small'" @click.stop="click_action(can_action)" />
    </template>
  </van-cell>
</template>

<script>

import {_url_api, param_encode} from "@/js/s94_tool.js";
import IconImg from "@/components/widget/IconImg.vue";
import {href_handle} from "@/vue_plugin/router_auto.js";
import Money from "@/components/widget/Money.vue";
import {S94Model} from "@/js/S94Model.ts";
import {ajax, pay_handle} from "@/js/api_tool.js";
import {confirm} from "@/js/vant_tool.ts";
import {debugToast} from "@/js/debug_tool.js";

/**
 * @prop {*}
 */
export default {
  _title_: '订单项目底部',
  _tip_: '订单列表的每一项底部区域，布局为左侧是支付金额，右侧是可操作按钮',
  _head_img_: '',
  _group_: '单元组件',
  components: {Money, IconImg},
  props:{
    model_name: {
      type: String,
      _label_: '模型名称',
      _tip_: '订单模型的名称，用于计算操作按钮',
      _default_: "get($input,'model_name')",
    },
    pay_money: {
      type: [String,Number],
      _label_: '支付金额',
      _tip_: '',
      _default_: "get($info,'pay_money')",
    },
    ban_action: {
      type: [String,Array],
      _label_: '屏蔽操作',
      _tip_: '',
      _default_: "",
    },
    is_admin: {
      type: Boolean,
      _label_: '管理员渠道',
      _tip_: '',
      _default_: '',
    },
    _info_: [String, Object, Array],
  },
  data(){
    return {}
  },
  methods:{
    /**
     * @param action_row
     * @returns {"default" | "primary" | "danger"}
     */
    buttonType(action_row){
      if (~['edit', 'pay', 'refund_agree', 'refund', 'refund_direct'].indexOf(action_row.type)){
        return 'primary'
      }
      if (~['delete', 'del', 'restore', 'cancel_pay', 'refund_cancel', 'refund_refuse'].indexOf(action_row.type)){
        return 'danger'
      }
      return 'default';
    },
    async click_action(action_row){
      let id = this._info_.id;
      if (!id) return debugToast('缺少ID');
      let url = `/${this.is_admin?'admin':'home'}/${this.model.name}/${action_row.action}?id=${id}`;
      if(action_row.type === "export_info") {
        window.open(_url_api(url), '_blank');
      }else if (action_row.form_param_ids || action_row.type === "refund_apply"){
        let param = {id, model_name:this.model.name, action:action_row.action};
        if (action_row.type === "info") param['is_info'] = 1;
        let path = `/${this.is_admin?'admin/model_base':'model_base'}/edit?`+param_encode(param);
        href_handle(path);
      }else if(action_row.type === "pay"){
        pay_handle(url, {}, ()=>{this.actionAfter();});
      }else {
        await confirm(`是否执行 【${action_row.label}】 操作`);
        let res = await ajax({url, showMessage:ajax.SHOW_MESSAGE_ALL, loading:true});
        this.actionAfter();
      }
    },
    actionAfter(){
      window.location.reload();
    }
  },
  computed:{
    model(){
      return S94Model.find(this.model_name);
    },
    ban_action_array(){
      if (!this.ban_action) return [];
      if (typeof this.ban_action === 'string') return this.ban_action.split(',');
      return this.ban_action;
    },
    can_action_list(){
      if (typeof this._info_ !== 'object' || !this.model) return []
      let res = [];
      let ban_action_array = this.ban_action_array;
      let ban_type_array = ["add","recycle","list","group_list","export_list"];

      let actionMap = this.is_admin ? this.model.canActionListAdmin(this._info_) : this.model.canActionListHome(this._info_)
      Object.values(actionMap).forEach((action_row)=> {
        if (~ban_action_array.indexOf(action_row.action)) return;
        if (~ban_type_array.indexOf(action_row.type)) return;
        res.push(action_row);
      })
      return res;
    },
  },
  mounted(){
  }
}
</script>